<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" >
<meta http-equiv="Cache" content="no-cache">
<meta http-equiv="expires" content="0">
<style>
body{background-color:black;}
#churl{color:white;}
</style>
<title>HTTP Live Streaming</title>
</head>
<body>
<p><select id=select  onChange=gotoChanel()><option>电视台</option></select></p>
<p id=churl></p>
<div align=center>
<video id=video width=800 height=600 controls=controls src="http://125.88.39.18/live.aishang.ctlcdn.com/00000110240127_1/encoder/0/2017081015/2931377444_820627_4520000000.ts"></video>
</div>
<p align=center><button id=btnLast>上一个</button>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<button id=btnNext>下一个</button></p>
</body>
<script src=tv.js></script>
<script>
var chanel;
function $id(s){return document.getElementById(s);}

window.onload=function(){
	chanel=tv.split(';');
	for(i=0;i<chanel.length;i++){
		$id("select").add(new Option(chanel[i].substring(0,chanel[i].indexOf(','))));
	}
}

function gotoChanel(){
	var j=document.all.select.selectedIndex-1;
	$id("video").src = chanel[j].substring(chanel[j].indexOf(',')+1);
	$id("video").play();
	$id("churl").textContent = j + ' ' + $id("video").src;
}

$id("btnLast").onclick=function(){	
	var j=document.all.select.selectedIndex-1;
	if(j>0){
	$id("select")[j].selected="selected";
	$id("video").src = chanel[j-1].substring(chanel[j-1].indexOf(',')+1);
	$id("video").play(); 
	$id("churl").textContent = j-1 + ' ' + $id("video").src;
	}
}

$id("btnNext").onclick=function(){
	var j=document.all.select.selectedIndex+1;
	if(j<document.all.select.length){
	$id("select")[j].selected="selected";
	$id("video").src = chanel[j-1].substring(chanel[j-1].indexOf(',')+1);
	$id("video").play(); 
	$id("churl").textContent = j-1 + ' ' + $id("video").src;
	}
}
</script>
<p align=center>&copy;&nbsp;Copyright 2017 版权所有 海天鹰工作室</p>
</html>
